<template>
  <view class="choose-house-card">
    <view class="choose-house-header">
      <text class="choose-house-title">{{title}}</text>
    </view>
    <view>
     <block v-if="signBase64==''">
      <view class="choose-house-btn" @click="goToSign">
        <view class="choose-house-btn-plus">
            <u-image mode="widthFix" :src="pen" width="13" height="13" ></u-image>
        </view>
        <text class="choose-house-btn-text">去签名</text>
      </view>
      </block>
      <block v-else>
        <u-image mode="scaleToFill" :src="signTempimg" width="100%" height="162rpx"></u-image>
      </block>
    </view>
  </view>
</template>

<script>
import warning from '@/static/warning.svg'
import pen from '@/static/pen.svg'
import { uploadSign } from '@/util/update'
export default {
  name: 'ChooseAHouse',
  props:{
    isVotingInfo:{
      deep:true,
      immediate:true,
      type:Object,
      default:()=>{}
    },
    title:{
        type:String,
        default:''
    }
  },
  watch:{
    isVotingInfo:{
      deep:true,
      immediate:true,
      handler(newVal){
        this.setVoteSign(newVal)
      
      },
    }
  },
  data() {
    return {
      pen,
      warning,
      isActive: false, // 切换为true/false即可看到不同UI
      signBase64: '',
      signTempimg: ''
    }
  },
  methods: {
    setVoteSign(newVal){
      if(newVal.voteSign){
        this.signBase64=newVal.voteSign
        this.signTempimg=newVal.voteSign
      }else{
        this.signBase64=''
      }
    },
    uploadSign(){
      uploadSign(this.signTempimg).then(res=>{
     
        this.$emit('uploadSign',res)
      }).catch(err=>{
        uni.showToast({ title: '上传失败', icon: 'none' });
      })
    },
    async goToSign() {
      let res=await this.$store.dispatch("community/checkLoginAndBoundHouses")
     
      if(!res) return
      this.$emit('goToSign')
      uni.navigateTo({
        url: '/pages/sign/index',
        success: () => {
          uni.$once('getSignImg', (e) => {
            if (e.sid == 'sign-board') {
              this.signBase64 = e.base64
              // #ifdef MP-WEIXIN
              this.base64ToPath(e.base64, (path) => {
                this.signTempimg = path;
                this.uploadSign()
                
              });
              // #endif
            }
          })
        }
      })
    },
    base64ToPath(base64, cb) {
      // 去掉前缀
      const data = base64.replace(/^data:image\/(png|jpg|jpeg);base64,/, '');
      const filePath = `${wx.env.USER_DATA_PATH}/sign_${Date.now()}.png`;
      const fs = wx.getFileSystemManager();
      const buffer = wx.base64ToArrayBuffer ? wx.base64ToArrayBuffer(data) : this.base64ToArrayBuffer(data);
      fs.writeFile({
        filePath,
        data: buffer,
        encoding: 'binary',
        success: () => {
          cb(filePath);
        },
        fail: (err) => {
          uni.showToast({ title: '图片保存失败', icon: 'none' });
          cb('');
        }
      });
    },
    base64ToArrayBuffer(base64) {
      const binary = atob(base64);
      const len = binary.length;
      const buffer = new Uint8Array(len);
      for (let i = 0; i < len; i++) {
        buffer[i] = binary.charCodeAt(i);
      }
      return buffer.buffer;
    }
  }
}
</script>

<style scoped lang="scss">
.choose-house-card {
  background: #fff;
  border-radius: 18rpx;
  padding: 30rpx 20rpx 32rpx 25rpx;
  margin-bottom: 24rpx;
  box-shadow: 0 4rpx 16rpx 0 rgba(0,0,0,0.04);
  margin-top: 20rpx;
}
.choose-house-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12rpx;
}
.choose-house-title {
  font-weight: 600;
  font-size: 30rpx;
  color: #000000;
}
.choose-house-info {
  margin-top:36rpx;
  margin-bottom: 21rpx;
  font-size: 28rpx;
  color: #666;
}
.choose-house-warning {
  display: flex;
  align-items: center;
  color: #F9901B;
  font-size: 28rpx;
}
.choose-house-warning-tip {
  margin-bottom: 32rpx;
}
.choose-house-warning-text {
  margin-left: 8rpx;
}
.choose-house-btn {
  width: 100%;
  border: 2rpx solid $uni-color-primary ;
  border-radius: 12rpx;
  color: $uni-color-primary ;
  font-size: 32rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 88rpx;
 
  margin-top: 18rpx;
}

.choose-house-btn-text {
  font-size: 30rpx;
  font-weight: 400;
  margin-left: 12rpx;
}
</style>
